﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Register.aspx.cs" Inherits="NoteSystem.Register" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>首页-后台管理</title>
	<link href="css/style.css" rel="stylesheet">
	<link href="css/font.css" rel="stylesheet" type="text/css">
	<link href="css/bootstrap.min.css" rel="stylesheet" type="text/css">
	<script src="js/jquery.min.js"></script>
	<script src="js/bootstrap.min.js"></script>
	<script>
        function sendAjax() {
            //1.获取用户输入的内容
            var name = document.getElementById("txtAccount").value;
            //2.发ajax请求
            var xhttp = new XMLHttpRequest();//创建对象
            //配置异步访问对象相关请求参数  参数1：http请求方式  参数2:接口地址  参数3：异步请求
            xhttp.open("GET", "CheckAccountHandler.ashx?Account=" + name, true);
            //ajax请求发送
            xhttp.send();
            //回调函数
            xhttp.onreadystatechange = function () {
                if (this.readyState == 4 && this.status == 200) {
                    //业务代码
                    var result = xhttp.responseText;//获取接口的响应文本
                    //true:账号能用  span标签隐藏
                    var sp = document.getElementById("sp");
                    if (result == "true") {
                        sp.style.display = "none";
                    }
                    //false:账号不能用 span标签显示
                    else {
                        sp.style.display = "block";
                    }
                }
            };

        }
        function checkPwd() {
            var pwd = document.getElementById("txtPwd");
            var rpwd = document.getElementById("txtRPwd");
            if (pwd.value != rpwd.value) {
                alert("密码不一致,请重新输入！");
                return false;
            }
            return true;

        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <div class="log_banner">
    	<div class="inset">
		<h1>用户注册</h1>
		<p>Connect the real world and the internet world!</p>
	</div>
     	   
	</div>
	<!--注册开始-->
	<div id="body">
		<div id="reg_box" class="left">
			<div method="post" action="/" role="form" autocomplete="on">
				<div class="my-group">
					<span class="left" >账号</span>
					<asp:TextBox ID="txtAccount" CssClass="form-control put1" runat="server" placeholder="请输入用户名" onblur="sendAjax()"  required>
					</asp:TextBox><span id="sp" style="color:red;display:none">用户已存在！</span>
				</div>
				<div class="my-group">
					<span class="left" >生日</span>
					<asp:TextBox ID="txtBirthday" CssClass="form-control put1" runat="server" placeholder="请输入您的生日" required></asp:TextBox>
				</div>
				<div class="my-group">
					<span class="left" >密码</span>
					<asp:TextBox ID="txtPwd" CssClass="form-control put1" TextMode="Password" runat="server" placeholder="请输入用密码"  required></asp:TextBox>
				</div>   
				<div class="my-group">
					<span class="left" >重复密码</span>
					<asp:TextBox ID="txtRPwd" CssClass="form-control put1" TextMode="Password" runat="server" onblur="checkPwd()" placeholder="请重复密码"  required></asp:TextBox>
				</div>
				<div class="my-group">
					<span class="left" >所在城市</span>
					<asp:DropDownList ID="ddlProvince"  runat="server" AutoPostBack="True" OnSelectedIndexChanged="ddlProvince_SelectedIndexChanged">
					</asp:DropDownList>
					<asp:DropDownList ID="ddlCity" runat="server" AutoPostBack="True" OnSelectedIndexChanged="ddlCity_SelectedIndexChanged" >
						<asp:ListItem Text="请选择城市" Value=""></asp:ListItem>
					</asp:DropDownList>
					<asp:DropDownList ID="ddlDistrict" runat="server">
						<asp:ListItem Text="请选择区域" Value=""></asp:ListItem>
					</asp:DropDownList>
				</div>
				<div class="my-group">
					<span class="left" >性别</span>
					<asp:RadioButtonList ID="rbtnGender" runat="server" CssClass="form-control put1" RepeatDirection="Horizontal">
						<asp:ListItem Value="0">男</asp:ListItem>
						<asp:ListItem Value="1">女</asp:ListItem>
					</asp:RadioButtonList>
				</div>
				<div class="my-group">
					<span class="left" >上传头像</span>
					<asp:FileUpload ID="fulImg"   runat="server" /><asp:Image ID="Image1" runat="server" /><asp:Button ID="Button1" runat="server" Text="上传" OnClick="Button1_Click" />
				</div>
				<div class="my-group">
					<span class="left" >电话</span>
					<asp:TextBox ID="txtPhone" CssClass="form-control put1" runat="server" placeholder="请输入电话" required></asp:TextBox>
				</div>
        
				<div class="my-group">
					<span class="left" >邮箱</span>
					<asp:TextBox ID="txtEmail" CssClass="form-control put1" runat="server" placeholder="请输入邮箱" required></asp:TextBox>
				</div>
				<div class="my-group">
					<span class="left" >QQ</span>
					<asp:TextBox ID="txtQQ" CssClass="form-control put1" runat="server" placeholder="请输入QQ" required></asp:TextBox>
				</div>
        
				<div class="form-actions">
					<p><input id="cb_clause" type="checkbox" checked="checked">我已经仔细阅读并同意<a href="#" target="_blank">《服务条款》</a>中的相关事项。</p>
					<asp:Button ID="btnRegister" CssClass="btn-primary btn" runat="server" Text="注册康辉帐号" OnClick="btnRegister_Click" />
					</div>
				</div>
		
			</div>
    
			<div class="side_box right">
				<h2>帐号与您的设备</h2>
				<p>
				感谢您的关注并准备注册为康辉用户。
				</p>
				<p>不想注册？ <a href="login.html"><i class="icon-weibo"></i>快速登录</a> </p>
				<p>
				作为一家传感器云网络提供商，我们致力于将您身边的物体接入互联网，并使您能方便地通过互联网或者移动设备了解他们的状态、控制他们。除了我们提供的硬件设备外，您也可以设计自己的传感器硬件，并通过<a href="" target="_blank">开放API</a>免费接入。
				</p>
		
			</div>
		</div>
    </form>
</body>
</html>
